<template>
	<view>
		<view class="evaluate">
			<u-form :model="form" :labelStyle="{fontSize: '30rpx'}" label-width="240" label-position="top" ref="uForm" class="evaluate-form">
				<u-alert-tips v-if="(info.status <= 3)" type="warning" description="工单评价后将自动结单~"></u-alert-tips>
				<u-form-item label="综合评价" label-position="left">
					<u-rate :count="5" size="38" active-color="#f39c12" v-model="form.stars"></u-rate>
				</u-form-item>
				<u-form-item label="问题是否解决" label-position="left">
					<u-radio-group v-model="form.solved">
						<u-radio name="0">未解决</u-radio>
						<u-radio name="1">已解决</u-radio>
					</u-radio-group>
				</u-form-item>
				<u-form-item label="我要反馈">
					<u-input v-model="form.feedback" type="textarea" placeholder="请输入意见或建议" />
				</u-form-item>
				<u-button @click="submit" :loading="formButtonStatus" :custom-style="formButtonStyle" shape="square" :hair-line="false" :ripple="true" :disabled="formButtonStatus" ripple-bg-color="rgba(45,211,232, 0.8)">
					提交评价
				</u-button>
			</u-form>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: 0,
				info: {},
				form: {
					stars: 1,
					solved: 0,
					feedback: ''
				},
				formButtonStatus: false,
				formButtonStyle: {
					backgroundImage: "linear-gradient(to bottom right, #34E4E8, #1FAEE8)",
					border: 'none',
					color: '#ffffff',
					outline: 'none',
					margin: '60rpx 80rpx 60rpx 80rpx'
				},
			}
		},
		onLoad(query) {
			this.id = query.id ? query.id:0
			this.load()
		},
		methods: {
			load: function () {
				var that = this
				that.$u.api.detailPost({
					id: that.id,
					type: 'evaluate'
				}).then(res => {
					if(res.code == 0) {
						uni.showModal({
							title: '温馨提示',
							content: res.msg,
							showCancel: false,
							success: res => {
								if (res.confirm) {
									uni.navigateBack({
										delta: 1
									})
								}
							}
						})
					} else {
						that.info = res.data.info
					}
				}).catch(res => {
					that.$u.toast('请求失败，请重试！');
				})
			},
			submit: function () {
				var that = this
				that.formButtonStatus = true
				that.form.id = that.id
				that.$u.api.evaluate(that.form).then(res => {
					that.$u.toast(res.msg);
					that.formButtonStatus = false
					if(res.code == 1) {
						setTimeout(() => {
							uni.navigateBack({
								delta: 1
							})
						}, 2500)
					}
				}).catch(res => {
					that.formButtonStatus = false
					that.$u.toast('请求失败，请重试！');
				})
			}
		}
	}
</script>

<style>
.evaluate-form {
	display: block;
	width: 92vw;
	margin: 0 auto;
	padding-top: 30rpx;
}
</style>
